import { Carts } from '@/api/index.js' // 购物车接口数据源
// 封装游客临时身份 uuid  生成一个随机字符串 （不会发生变化）
import { getUUID } from '@/utils/uuid_token.js'
// 数据源
const state = {
  cartsList: '',
  // 游客临时身份  该身份不会因为关闭浏览器而消失
  // 将该 token 值 带给服务端
  // 服务端根据这个 判断 这是谁的 购物车
  uuid_token: getUUID()
}
// 修改 state 数据源
const mutations = {
  cartsList(state, value) {
    state.cartsList = value
  }
  /*   cartsCount(state, value) {
      state.cartscount = value
      console.log(value);
    } */
}

// 异步函数，书写业务
const actions = {
  async cartsList(state, params) {
    // params 接收客户端的post传参
    let result = await Carts(params)


    if (result.status == 200) {
      // 服务端响应过来的数据
      state.commit('cartsList', result.data)


      //  以下的代码作用只有一个 修改商品的数量时，对浏览器的数据实时更新

      // 为什么要处理，客户端修改了服务端的数据，服务端的的确确修改了，但是并没有响应回来，页面得刷新才能 看到最新的修改结果
      //  用 acyns awiat 修饰请求还是不能同步数据
      //  再发一次请求 + - 和 input 就 乱了 会变成 +2 -2
      // 所以我将第一次请求过来的数据存储在浏览器中,如果修改了数据,读取浏览器中的数据
      // 重新赋值 给  cartsList(存储服务端的数据) 数组
      // vue页面根据vuex的数据更新,实时渲染页面数据 这个是不会影响数据库中的数据的,因为我只是渲染页面,并没有再一次发请求修改数据
      // 无论怎么刷新,都不影响服务端的数据

      // 将 购物车数据存储到浏览器
      let count = window.localStorage.goodscount = JSON.stringify(result.data)

      let arr = JSON.parse(count); // 拿出来
      let num = params.state.count  // 声明第三方变量来修改商品的值

      arr.filter(item => {
        // item._id == params._id  筛选对象指定的 _id
        //  params.state.event  触发的事件
        if (item._id == params._id && params.state.event == 'add') {
          num += 1
          item.goodsCount = num
        } else if (item._id == params._id && params.state.event == 'sub') {
          num -= 1
          item.goodsCount = num
          if (item.goodsCount < 1) item.goodsCount = 1
        } else if (item._id == params._id && params.state.event == 'input') {
          if (params.state.count < 1) params.state.count = 1
          num = params.state.count
          item.goodsCount = num
        }
        // 重新渲染
        state.commit('cartsList', arr)
      });


    } else {
      return Promise.reject(new Error('faile'))
    }
  },
}

// 计算属性
const getters = {
  // 商品信息数据
  goodsCount(state) {
    return 0
  }

}



// 向外共享函数
export default {
  state,
  mutations,
  actions,
  getters
}
